<div class="container">
    <div class="row login-container column-seperation">
        <div class="col-md-5 col-md-offset-1">
            <h2>Đăng nhập Menu Online</h2>
            <p>Đăng nhập bằng Facebook, Twitter hoặc email.<br>
                <a href="login.html#">Đăng ký !</a> tài khoản Menu Online, luôn miễn phí..</p>
            <br>

            <button class="btn btn-block btn-info col-md-8" type="button">
                <div class="pull-left">&nbsp;&nbsp;&nbsp;<i class="fa fa-facebook"></i></div>
                <span class="bold">Đăng nhập qua Facebook</span> </button>
            <button class="btn btn-block btn-success col-md-8" type="button">
                <div class="pull-left">&nbsp;&nbsp;&nbsp;<i class="fa fa-twitter"></i></div>
                <span class="bold">Đăng nhập qua Twitter</span>
            </button>
        </div>
        <div class="col-md-5 "> <br>

                <div class="row">
                    <div class="form-group col-md-10">
                        <label class="form-label">Username</label>
                        <div class="controls">
                            <div class="input-with-icon  right">
                                <i class=""></i>
                                <input type="text" name="txtusername" id="txtusername" class="form-control">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="form-group col-md-10">
                        <label class="form-label">Password</label>
                        <span class="help"></span>
                        <div class="controls">
                            <div class="input-with-icon  right">
                                <i class=""></i>
                                <input type="password" name="txtpassword" id="txtpassword" class="form-control">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-10">
                        <div id="login-error-ctn" class="hide alert alert-warning"></div>
                    </div>
                </div>
                <div class="row">
                    <div class="control-group  col-md-10">
                        <div class="checkbox checkbox check-success"> <a href="login.html#">Trouble login in?</a>&nbsp;&nbsp;
                            <input type="checkbox" id="checkbox1" value="1">
                            <label for="checkbox1">Keep me reminded </label>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-10">
                        <button id="btnLogin" class="btn btn-primary btn-cons pull-right" >Login</button>
                    </div>
                </div>

        </div>


    </div>
</div>
<script>
    $(document).ready(function(){
        $('#txtusername').focus();

        $('#txtusername').focusin(function(){
            $('#login-error-ctn').removeClass('show').addClass('hide').html('')
        })

        $("#txtpassword").keypress(function(event) {
            if ( event.which == 13 ) {
                $('#btnLogin').trigger('click');
                event.preventDefault();
            }else{
                $('#login-error-ctn').removeClass('show').addClass('hide').html('')
            }
        });

        $('#btnLogin').click(function(){
            username = $('#txtusername').val();
            password = $('#txtpassword').val();
            $.post('/login/login',{username:username,
                    password:password
                }
                ,function(result){

                    if (result.success){
                        backLocation = document.referrer;
                        if (backLocation) {
                            window.location.assign(backLocation);
                        }
//                        history.back(1);
                    }else{
                        $('#login-error-ctn').removeClass('hide').addClass('show').html(result.msg)
                    }

                },'json');
        })
    })
</script>